import { DatePicker } from "antd"
import dayjs from "dayjs"
import { FC } from "react"

import { SFormItem } from "@/components/common"
import { useLocale } from "@/locales"

const { RangePicker } = DatePicker
const TimeWithButton: FC<{ setFieldValue: (name: string, value: any) => void }> = props => {
	const { formatMessage } = useLocale()
	const handleChange = (dates: any) => {
		console.log(dates)
		props.setFieldValue("registerTime", dates)
	}
	// const Buttons = (
	// 	<div className="flxR aiC" style={{ gap: "10px" }}>
	// 		<Button onClick={() => handleChange([])}
	// 	</div>
	// )
	return (
		<SFormItem label={formatMessage({ id: "common.createAt" })}>
			<RangePicker renderExtraFooter={() => "extra footer"} showTime onChange={handleChange} maxDate={dayjs()} />
		</SFormItem>
	)
}

export default TimeWithButton
